<template>
	<view class="pages1" v-show="types">
		<view class="item1">
			<view class="iv1" @click="addzj">增加</view>
			<view class="iv2" @click="tctccd()">删除</view>
		</view>
		
		<view class="item2">
			<view @click="addxz(1)" :class="{'xz1':cur1==1}"  class="itv1">一班理货员</view>
			<view @click="addxz(2)" :class="{'xz1':cur1==2}"  class="itv1">二班理货员</view>
			<view @click="addxz(3)" :class="{'xz1':cur1==3}"  class="itv1">三班理货员</view>
			<view @click="addxz(4)" :class="{'xz1':cur1==4}"  class="itv1">四班理货员</view>
		</view>
		
		<view v-show="lhtype"  class="ck" style="border: 1px solid #3c77b7;">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;" @click="qxlhtype">关闭</view>
			</view>
			<view style="height: 300px;overflow: auto;">
				<view class="itv3" v-for="item  in lhytypelist" @click="addlhyxz(item)" :key="item.id"  :class="{'xz1':cur2==item.id}"  >
					{{item.cname}}
				</view>
			</view>
			<view class="buts" @click="qxlhtype">确认</view>
		</view>
		<view v-show="lhbbcode" class="ck" style="border: 1px solid #3c77b7;">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;" @click="qxlhbbcode">关闭</view>
			</view>
			<view style="height: 300px;margin: 0 auto;width: 90%;border: 3px solid #3c77b7;overflow: hidden;margin-bottom: 10px;">
				<image style="width: 100%;height: 100%;" :src="lhbbimages"></image>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name:"zbzr",
		props: {
			types: {
				type: Boolean,
				default: false,
				required: true
			},
			uid:{
				type: Number
			}
		},
		data() {
			return {
				uinfo:'',
				lbblist:[],
				cdinfo:'',
				lhbbcode:false,
				lhbbimages:'',
				cur1:'',
				lhytypelist:[],
				lhtype:false,
				cur2:'',
				xzlhyinfo:''
			};
		},
		created(){
				this.getuserinfo();
		},
		methods: {
			addlhyxz(e){
				this.cur2 = e.id
				this.xzlhyinfo = e
			},
			addxz(e){
					this.cur1 = e
					this.lhtype = true
					this.getlhbblist(e)
			},
			qxlhtype(){
				this.lhtype = false
			},
			tctccd(e){
				let that = this
				uni.showModal({
					title: '是否退出车队',
					content: '取消操作',
					success: function (res) {
						if (res.confirm) {
							that.deluserinfo()
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});	
			},
			async deluserinfo(e){
				if(this.cur2==''){
					uni.showToast({
						title: '请选择后在操作',
						icon: "none",
						duration: 2000
					});
					return false;
				}
				let data = {
					id:this.cur2,
				}
				let res = await this.$api.deluserinfo(data)
				if(res.data.code==0){
					//log
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:'值班主任删除了理货员'+this.xzlhyinfo.cname,
						lv:1,
						type:4,
						cz:JSON.stringify(this.xzlhyinfo)
					}	
					await this.$api.addlogs(data1)
					
					this.getlhbblist(this.cur1)
				}else{
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
			qxlhbbcode(){
				this.lhbbcode = false
			},
			//添加理货员
			async addzj(e){
				if(this.cur1==''){
					uni.showToast({
						title: '请选择班别后在操作',
						icon: "none",
						duration: 2000
					});
					return false;
				}else{
					let data = {
						lhbb:this.cur1,
					}
					let res = await this.$api.addlhyinfo(data)
					console.log(res.data)
					this.lhbbcode = true
					this.lhbbimages = res.data
				}
				
			},
			async getinfo(){
				let data = {
					id:this.uinfo.cdid
				}
				let res =  await this.$api.getinfo(data)
				console.log(res.data.code)
				if(res.data.code==0){
					this.cdinfo = res.data.data
				}
			},
			async getlhbblist(e){
				let data = {
					lhbb:e
				}
				let res =  await this.$api.getlhbblist(data)
				if(res.data.code==0){
					this.lhytypelist = res.data.data
				}
			},
			async getuserinfo(){
				let data = {
					// id:uni.getStorageSync('uid'),
					id:this.uid
				}
				let res =  await this.$api.getuserinfo(data)
				console.log(res.data.code)
				if(res.data.code==0){
					this.uinfo = res.data.data
					uni.setStorageSync('uid', res.data.data.id);
					uni.setStorageSync('cdtype', res.data.data.cdtype);
					this.getinfo();
					this.getlhbblist()
				}			
			}
		}
	}
</script>

<style lang="less" scoped>
	.pages1{
		background-color: #ffffff;
	}
	.item1{
		overflow: hidden;
		height: 60px;
		
	}
	.iv1{
		width: 46%;
		height: 60px;
		line-height: 60px;
		border: 3px solid #3c77b7;
		background-color: #458fe4;
		float: left;
		text-align: center;
		font-size: 20px;
		border-radius: 10px;
		margin-left: 10px;
		font-weight: 600;
	}
	.iv2{
		width: 46%;
		height: 60px;
		line-height: 60px;
		border: 3px solid #3c77b7;
		background-color: #e37e83;
		float: left;
		color: #ffffff;
		text-align: center;
		font-size: 20px;
		border-radius: 10px;
		margin-left: 10px;
		font-weight: 600;
	}
	.item2{
		margin-top: 10px;
	}
	.itv1{
		width: 80%;
		border: 3px solid #3c77b7;
		height: 50px;
		line-height: 50px;
		text-align: center;
		color: #3c77b7;
		margin: 0 auto;
		margin-top: 10px;
		border-radius: 10px;
		font-size: 20px;
	}
	
	.ck{
		z-index:999;
		-moz-opacity:1;
		opacity: 1;
		// border: 1px solid #000000;
		position: fixed;
		background-color: #ffffff;
		width: 90%;
		border-radius: 5px;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		//padding: 10upx;
	}
	.itv3{
		width: 23%;
		float: left;
		height: 50px;
		line-height: 50px;
		text-align: center;
		color: #3c77b7;
		border: 3px solid #3c77b7;
		margin-left: 5px;
		margin-top: 5px;
		border-radius: 10px;
	}
	.xz1{
		background-color: #3c77b7;
		color: #ffffff;
	}
	.buts{
		width: 80%;
		height: 40px;
		line-height: 40px;
		text-align: center;
		background-color: #3c77b7;
		color: #ffffff;
		font-size: 20px;
		font-weight: 600;
		margin: 0 auto;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
</style>